<template>
	<cl-crud ref="crud" @load="onLoad" >
		<cl-pagefull>
			<template #head>
				<el-row type="flex">
					<cl-filter-group v-model="search">
						<cl-filter label="事业部">
							<cl-select v-model="search.biz_id" placeholder="请选择" filterable @change="changeBiz">
								<el-option v-for="item in business" :key="item.biz_id" :label="item.biz_name" :value="item.biz_id" />
							</cl-select>
						</cl-filter>
						<cl-filter label="门店">
							<cl-shop-select
								v-model="search.dept_id"
								filterable
								clearable
								:biz_id="search.biz_id"
								style="width: 100%"
							/>
						</cl-filter>
					</cl-filter-group>
				</el-row>
			</template>

			<!-- 数据表格 -->
			<el-row>
				<cl-table v-bind="tableProp">
					<template #column-opt="{scope:{row}}">
						<el-button type="primary" @click="edit(row)">编辑</el-button>
					</template>
				</cl-table>
			</el-row>
			<template slot="foot">
				<el-row type="flex">
					<cl-flex1 />
					<!-- 分页控件 -->
					<cl-pagination />
				</el-row>
			</template>
		</cl-pagefull>
		<EditDialog ref="editDialogRef" @successed="refresh" />
	</cl-crud>
</template>

<script>
import EditDialog from "./components/editDialog.vue";
import pageMinix from "@/mixins/page";
export default {
	mixins: [pageMinix],
	components: {
		EditDialog
	},
	data() {
		return {
			tableProp: {
				"context-menu": ["refresh"],
				columns: [
					{
						label: "门店",
						prop: "dept_name",
						minWidth: 100,
						align: "left",
						showOverflowTooltip: true
					},
					{
						label: "财务",
						prop: "user_name",
						minWidth: 100,
						align: "left",
						showOverflowTooltip: true
					},
					{
						label: "收款方式",
						prop: "payee_name",
						minWidth: 100,
						align: "left",
						showOverflowTooltip: true
					},
					{
						label: "分成方式",
						prop: "sharing_method_name",
						minWidth: 100,
						align: "left",
						showOverflowTooltip: true
					},
					{
						label: "备注",
						prop: "remark",
						minWidth: 100,
						align: "left",
						showOverflowTooltip: true
					},
					{ label: "操作", prop: "opt", width: 100, fixed: "right", disable: true }
				]
			},
			search: {
				biz_id: "",
				dept_id: ""
			},
		};
	},

	created() {
		this.search.biz_id = this.getCurrBiz()
		this.getBizRefShop(biz_id);
	},
	mounted() {},
	methods: {
		onLoad({ ctx, app }) {
			ctx.service(this.$service.reconciliation)
				.set("dict", {
					api: {
						page: "deptList"
					}
				})
				.done();
			app.refresh(this.search);
		},
		refresh() {
			console.log("crud");
			const refresh = this.$refs.crud.refresh;
			refresh && refresh({ page: 1, ...this.search });
		},
		edit(row) {
			this.$refs.editDialogRef.open(this.$TOOL.objCopy(row),);
		
		}
	}
};
</script>
<style scoped lang="scss"></style>
